<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>用户信息修改</title>

    <base href="/">

    <link rel="shortcut icon" href="assets/media/image/favicon.png"/>
    <link rel="stylesheet" href="vendors/bundle.css" type="text/css">
    <link rel="stylesheet" href="vendors/datepicker/daterangepicker.css">
    <link rel="stylesheet" href="vendors/vmap/jqvmap.min.css">
    <link rel="stylesheet" href="assets/css/app.css" type="text/css">
    <!--弹窗CSS-->
    <link rel="stylesheet" href="assets/css/modal.css" type="text/css">
</head>
<body class="container">

<div class="preloader">
    <div class="preloader-icon"></div>
</div>

<!--引入公共头部页面-->
<div th:replace="~{commons/header :: header}"></div>

<div id="main">
    <!--引入公共导航栏页面-->
    <div th:replace="~{commons/navigation :: navigation}"></div>

    <!-- begin::主要内容 -->
    <div class="main-content">
        <div class="row">
            <div class="col-md-10 card" style="margin-left: 15px">
                <form id="userInfoModify" action="/user/info_modify" method="post" style="margin-top: 50px;margin-bottom: 50px;font-size: 115%">
                    <input name="id" th:value="${user.id}" type="hidden">
                    <div class="form-group row">
                        <label for="uname" class="col-sm-4 col-form-label text-right">用户名</label>
                        <div>
                            <input name="username" th:value="${user.username}" readonly type="text" class="form-control" id="uname" style="border-radius: .30em;">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label for="password" class="col-sm-4 col-form-label text-right">密码</label>
                        <div>
                            <input name="pwd" th:value="${user.pwd}" readonly type="password" class="form-control" id="password"  style="border-radius: .30em;">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label for="name" class="col-sm-4 col-form-label text-right">姓名</label>
                        <div>
                            <input name="name" th:value="${user.name}" id="name" type="text" class="form-control"  style="border-radius: .30em;">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label for="company" class="col-sm-4 col-form-label text-right">单位</label>
                        <select name="companyId" class="col-sm-3 form-control" id="company" style="border-radius: .30em;">
                            <option disabled>请选择...</option>
                            <option th:value="${user.companyId}" th:text="${user.companyName}" selected value="1">One</option>
                        </select>
                    </div>

                    <div class="form-group row">
                        <label for="department" class="col-sm-4 col-form-label text-right">部门</label>
                        <select name="departmentId" class="col-sm-3 form-control" id="department"  style="border-radius: .30em;">
                            <option disabled>请选择...</option>
                            <option th:value="${user.departmentId}" th:text="${user.departmentName}" value="1">One</option>
                        </select>
                    </div>
                    <div class="form-group row">
                        <label for="phone" class="col-sm-4 col-form-label text-right">联系方式</label>
                        <div>
                            <input th:value="${user.phone}" name="phone" type="text" class="form-control" id="phone"  style="border-radius: .30em;">
                        </div>
                    </div>

                    <div class="form-group row">
                        <label for="role" class="col-sm-4 col-form-label text-right">角色</label>
                        <select name="role" class="col-sm-3 form-control" id="role" style="border-radius: .30em;">
                            <option disabled>请选择...</option>
                            <option th:selected="${user.role==0}" value="0">分公司管理员</option>
                            <option th:selected="${user.role==1}" value="1">燃料业务人员</option>
                            <option th:selected="${user.role==2}" value="2">监察人员</option>
                            <option th:selected="${user.role==3}" value="3">管理人员</option>
                            <option th:selected="${user.role==4}" value="4">公告通知发布人员</option>
                        </select>
                    </div>

                    <div class="form-group row">
                        <div class="col-sm-5 text-right">
                            <button type="submit" class="btn btn-primary"  style="border-radius: .30em;">修改</button>
                        </div>
                        <div class="col-sm-3 text-right">
                            <a th:href="${#request.getHeader('Referer')}" type="button" class="btn btn-gradient-dark"  style="border-radius: .30em;">取消</a>
                        </div>
                    </div>
                </form>
            </div>
        </div>

        <!--引入公共的JavaScript脚本-->
        <div th:replace="~{commons/footer :: footer}"></div>
    </div>
</div>
<!--引入公共的JavaScript脚本-->
<div th:include="~{commons/scripts :: scripts}"></div>
<script src="assets/js/app.js"></script>
<script src="assets/js/modal.js"></script>
<script th:inline="javascript">
    $(() => {
        $('#userInfoModify').submit(function () {
            let data = $("#userInfoModify").serializeArray();
            let url = "/user/update"
            $.post(url, data, function (data) {
                if (data.code >= 0) {
                    var mModal1 = new mModal({
                        title: "提示", // 标题，默认：提示
                        width: "25%", // 弹出框宽度，默认 25%
                        top: "25vh", // 距离可视区域顶部距离 CSS中 margin-top 值
                        content: "修改成功", // 正文，默认：正文内容
                        cancelText: "取 消", // 取消按钮文本
                        confirmText: "确 定", // 确定按钮文本
                        showCancelButton: false, // 是否显示取消按钮
                        showConfirmButton: true, // 是否显示确定按钮
                        showClose: true, // 是否显示关闭按钮
                        modal: true, // 是否需要遮罩层
                        customClass: "", // 自定义类名confirm
                        confirm: function () {
                            mModal1.close();
                            window.location.href = /*[[${#request.getHeader('Referer')}]]*/"/user/query"
                        },
                    });
                    mModal1.renderDom();
                }
            }, "json")
            return false;
        })
    })
</script>
</body>
</html>
